<template>

	<!-- <c-navBar title="教务数据"></c-navBar> -->

	<view class="heard">
		<slot></slot>
		<timeSelct @emitTime="emitTime" v-if="props.timeShow"></timeSelct>
		<view class="mid-box flex flex-a" v-if="props.selectShow">
			<view class=""> 
				<uni-data-select style="margin-right: 16rpx;" v-model="pramas.school" :localdata="props.localData1"
					placeholder="选择分校"></uni-data-select>
			</view>
  
			<view class="value-item">
				<input class="uni-input" placeholder="输入年级" v-model="pramas.grade" />
			</view>
		</view>
		<view class="seach-box">
			<slot name="select"></slot>
			<view class="value-item value-item-1">
				<input class="uni-input" placeholder="输入关键词" v-model="pramas.value" />
			</view>
			<view class="seach-btn">
				<view class="button-box" type="primary" size="small" @click="seach">搜索</view>
			</view>
		</view>

	</view>

</template>

<script setup>
	import timeSelct from "../../components/timeSelct/index.vue"
	import {
		onLoad,
		onShow
	} from "@dcloudio/uni-app"
	import {
		ref,
		defineExpose,
		reactive
	} from "vue"
	const pramas = reactive({
		start_date: '',
		end_date: '',
		type: '',
		value: '',
		school: '',
		grade: '',
	})
	const list = ref([]);
	const error = ref(false);
	const loading = ref(false);
	const props = defineProps({

		selectShow: {
			type: Boolean,
			default: false
		},
		timeShow: {
			type: Boolean,
			default: true
		},
		parmas: {
			type: Object,
			default: () => {
				return {}
			}
		},
		localData1: {
			type: Object,
			default: () => {
				return []
			}
		},
		localData2: {
			type: Object,
			default: () => {
				return []
			}
		},
	})
	const emit = defineEmits(['emitParmas'])
	const actions = [{
			text: '选项一'
		},
		{
			text: '选项二'
		},
		{
			text: '选项三'
		},
	];
	onLoad(() => {

	})

	const emitTime = (data) => {
		pramas.start_date = data.start_date
		pramas.end_date = data.end_date
	}
	const seach = (action) => {
		emit('emitParmas', pramas)
	}
	const Loads = () => {
		loading.value = false;
		error.value = true;
		// fetchSomeThing().catch(() => {
		//   loading.value = false;
		//   error.value = true;
		// });
	};
	const clearData = () => {

	}
	defineExpose({
		clearData
	})
</script>

<style lang="scss" scoped>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 100vw;
		min-height: 90vh;
	}

	.heard {
		position: relative;
		// position: sticky;
		// top: 44px;
		// left: 0;
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 100vw;
		height: auto;
		// background: rgba(255, 255, 255, 1);
		padding-bottom: 20rpx;
		padding-top: 10rpx;
	}


	.seach-box {
		display: flex;
		width: 670rpx;
		margin-top: 18rpx;
	}

	.type-item {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 192rpx;
		height: 66.59rpx;
		opacity: 1;
		border-radius: 10.51rpx;
		background: rgba(255, 255, 255, 1);
		border: 2rpx solid rgba(252, 247, 247, 1);

		text {
			font-size: 24rpx;
			font-weight: 400;
			letter-spacing: 0px;
			line-height: 30.46rpx;
			color: rgba(102, 102, 102, 1);
			margin-right: 28rpx;

		}

		.type-item-icon {
			font-size: 24rpx;
			color: rgba(102, 102, 102, 1);
		}


	}

	text {
		font-size: 32rpx !important;
	}

	.value-item { 
		flex: 1;
		height: 66.59rpx;
		opacity: 1;
		border-radius: 10.51rpx;
		background: rgba(255, 255, 255, 1);
		margin-left: 9rpx;
		border: 2rpx solid rgba(252, 247, 247, 1);

		.uni-input {
			height: 66.59rpx;
			width: 345.21rpx;
			padding: 0 23rpx;
		}
	}

	.seach-btn {
		display: flex;
		align-items: center;
		justify-content: flex-end;

		height: 66.59rpx;
		margin-left: 26rpx;
		.button-box{
			display: flex;
			align-items: center;
			justify-content: center;
			width: 128rpx;
			height: 66.59rpx;
			background: #4e6ef2;
			color: #fff;
			border-radius: 12rpx;
		}
		text {
			font-size: 21.03rpx;
			line-height: 30.46rpx;
			color: rgba(51, 51, 51, 1);
		}

	}

	.forgetting-list {
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 100%;
	}

	.forgetting-item {
		position: relative;
		display: flex;
		align-items: center;
		padding: 24rpx;
		width: 670rpx;
		height: 112.15rpx;
		opacity: 1;
		border-radius: 18rpx;
		background: rgba(255, 255, 255, 1);
		border: 1rpx solid rgba(204, 204, 204, 1);
		margin-bottom: 32rpx;
	}

	.forgetting-tab {
		display: flex;
		flex-direction: column;
		width: 547rpx;
	}

	.forgetting-tab-top {
		display: flex;
		justify-content: space-between;
		width: 100%;
		margin-bottom: 16rpx;

	}

	.forgetting-tab-bottom {
		margin-top: 19rpx;
	}

	.tab-item {
		display: flex;
		align-items: center;

		.tab-item-img {
			width: 30rpx;
			height: 30rpx;
			margin-right: 11rpx;
			object-fit: contain;
		}
	}

	.tab-item-text {
		/** 文本1 */
		font-size: 22rpx;
		line-height: 32rpx;
		text-align: left;


	}

	.tab-item-text1 {
		color: rgba(153, 153, 153, 1);
		/** 文本1 */

	}

	.forgetting-name {
		width: 63.08px;
		height: 31.54px;
		opacity: 1;
		transform: rotate(30deg);
		font-size: 21.03rpx;
		font-weight: 700;
		line-height: 30.46rpx;
		color: rgba(153, 153, 153, 1);
		text-align: right;
		vertical-align: top;

	}

	.forgetting-name-2 {
		color: rgba(11, 186, 81, 1);
	}

	.mid-box {
		margin-bottom: 16rpx;
		width: 21.08281rem;

	}

	.value-item-1 {
		flex: 1;
		margin-left: 0px;
	}
</style>